<template>
  <Dialog v-model="dialogVisible" title="申报条件详情" width="800px">
    <el-descriptions :column="2" border>
      <el-descriptions-item label="条件名称">
        {{ conditionData.conditionName || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="职业代码">
        {{ conditionData.professionCode || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="技能等级">
        <el-tag>{{ conditionData.skillLevel || '-' }}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="评价方式">
        {{ getEvaluationMethodName(conditionData.evaluationMethod) }}
      </el-descriptions-item>
      <el-descriptions-item label="条件类型">
        {{ getConditionTypeName(conditionData.conditionType) }}
      </el-descriptions-item>
      <el-descriptions-item label="是否必需">
        <el-tag :type="conditionData.isRequired ? 'success' : 'info'">
          {{ conditionData.isRequired ? '必需' : '可选' }}
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="逻辑操作符">
        {{ conditionData.logicOperator || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="排序">
        {{ conditionData.conditionOrder || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="状态">
        <el-tag :type="conditionData.conditionStatus === 1 ? 'success' : 'danger'">
          {{ conditionData.conditionStatus === 1 ? '启用' : '禁用' }}
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="条件参数" :span="2">
        <div style="white-space: pre-wrap; max-height: 200px; overflow-y: auto;">
          {{ conditionData.conditionParameters || '-' }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="验证规则" :span="2">
        <div style="white-space: pre-wrap; max-height: 200px; overflow-y: auto;">
          {{ conditionData.validationRules || '-' }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="创建时间">
        {{ conditionData.createTime || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="更新时间">
        {{ conditionData.updateTime || '-' }}
      </el-descriptions-item>
    </el-descriptions>
    
    <template #footer>
      <el-button @click="dialogVisible = false">关闭</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { getApplicationCondition } from '@/api/eval/condition'

const dialogVisible = ref(false)
const conditionData = ref({} as any)

const getEvaluationMethodName = (method: string) => {
  const methodMap = {
    'assessment': '认定评价',
    'examination': '考试评价',
    'mixed': '混合评价'
  }
  return methodMap[method] || '-'
}

const getConditionTypeName = (type: string) => {
  const typeMap = {
    'education': '学历要求',
    'work_experience': '工作年限',
    'training': '培训经历',
    'certificate': '证书要求',
    'other': '其他要求'
  }
  return typeMap[type] || '-'
}

const open = async (id: number) => {
  dialogVisible.value = true
  try {
    const data = await getApplicationCondition(id)
    conditionData.value = data
  } catch (error) {
    console.error('获取申报条件详情失败:', error)
  }
}

defineExpose({ open })
</script>